<template>
	<view id="container">
		<view class="login">
			<view class="text">
				注册
			</view>
			<view class="denglu">
				<input type="text" placeholder="请输入姓名" v-model="register.user">
			</view>
			<view class="denglu">
				<input type="text" placeholder="请输入账号" v-model="register.name">
			</view>
			<view class="denglu">
				<input type="password" placeholder="请输入密码" v-model="register.password">
			</view>
			<view class="denglu">
				<input type="text" placeholder="请输入电话" v-model="register.phone">
			</view>


			<!-- 注册 和忘记密码  -->
			<view class="denglu">
				<navigator @click="toRegister1">已有账号！立即登录</navigator>
			</view>

			<!-- 登录按钮 -->
			<view class="denglu">
				<button class="btn-dl" type="primary" @click="toRegister">注册</button>
			</view>
		</view>
	</view>

</template>
<script setup>
	import http from '../../utils/http'
	import {
		reactive
	} from "vue";
	let register = reactive({
		name: '',
		user: '',
		password: '',
		phone: ''
	})

	const toRegister = function() {
		if(register.name == '' || register.password=='' || register.phone=='' || register.user == ''){
			wx.showToast({
				title: '信息不能为空!',
				icon: 'error',
				duration: 1000 //持续的时间
			})
		}else{
			http({
				url: '/add/user',
				method: 'post',
				data: {
					name: register.name,
					pwd: register.password,
					tel: register.phone,
					uname: register.user
				}
			}).then((res) => {
				console.log(res);
				if (res.msg = 'success') {
					wx.showToast({
						title: '注册成功',
						icon: 'success',
						duration: 1000 //持续的时间
					})
					wx.navigateTo({
						url: "../Login/Login"
					})
				}
			})
		}
	}
	const toRegister1 = function(){
		wx.navigateTo({
			url: "../Login/Login"
		})
	}
</script>
<style scoped lang="less">
	#container {
		height: 100vh;
		width: 750rpx;
		background: #356363;
		display: flex;
		align-items: center;

		.login {
			margin: 0 auto;
			width: 545rpx;
			height: 750rpx;
			background: #FFFFFF;
			border-radius: 50rpx;
			box-sizing: border-box;
			padding: 50rpx;

			.text {
				// padding: 30rpx 0 0 50rpx;
				width: 150rpx;
				height: 100rpx;
				font-size: 60rpx;
				font-family: Helvetica;
				color: #000000;
				line-height: 100rpx;
				letter-spacing: 2rpx;
			}

			.denglu {
				padding: 20rpx 0;
			}
		}
	}
</style>
